Écrans Retina
Cet été, impossible de passer à côté de l’info : la sortie très attendue chez Apple d’un ordinateur portable avec écran Retina. Déjà utilisés depuis l’iPhone 4 et sur le Nouvel iPad, ces écrans ont la particularité d’avoir une résolution extrêmement élevée, rendant les pixels pratiquement indiscernables à l’œil nu.
Même si Apple est le premier constructeur à le proposer sur un ordinateur, ce type d’écran est aussi présent chez d’autres fabricants, notamment chez Android. Il y a donc fort à parier que les machines bénéficiant d’écrans à haute densité de pixels vont se multiplier dans les années à venir. Que cela soit sur les tablettes, smartphones ou ordinateurs, les écrans de type Retina seront certainement un standard de l’industrie d’ici quelques années. Il est donc grand temps de s’y préparer et de savoir ce que cela change pour votre site web.
Ces écrans affichent donc plus de pixels pour la même surface ce qui les rend extrêmement précis. Les textes sont d’une netteté incroyable, on a l’impression de se retrouver devant un livre ! Il n’en va pas de même pour les images et autres icônes: si on ne fait rien, les éléments graphiques seront pixélisés, flous et le rendu du site paraîtra malheureusement de mauvaise qualité.
Il faut par conséquent intervenir sur votre site afin d’offrir un rendu visuel optimal à vos visiteurs et prévoir des images en haute résolution pour les personnes ayant un écran Retina. En utilisant des techniques de Responsive Web Design, on peut ensuite, d’une manière transparente pour l’utilisateur, proposer ces images en haute définition aux personnes qui pourront en bénéficier.
Mais qui dit images de haute qualité dit images plus longues à télécharger. Et nous savons tous que notre temps, tout comme notre forfait 3G, est précieux. Attention donc à bien étudier ce qu’il est indispensable de proposer en haute définition et ce qu’il est judicieux de laisser tel quel dans le but d’améliorer la navigation. Car l’expérience utilisateur ne se résume pas au seul aspect visuel du site, mais passe également par sa réactivité et son efficacité.
Ce que je recommande pour optimiser vos sites pour les écrans Retina, tant graphiquement qu’en termes de temps de chargement, c’est de travailler en priorité vos icônes et autres logos de votre branding. Une photo un peu floue ou pixélisée peut paraître encore acceptable, mais une icône qui n’est pas réalisée au pixel près (cela vaut d’ailleurs pour tous les types d’écrans) est un vrai problème pour l’œil.
Les appareils munis d’écrans Retina vont être de plus en plus présents, il ne faut donc pas négliger l’expérience de leurs utilisateurs lors de la conception de votre site web.
Pour les geeks, lire également